<ui:composition xmlns="http://www.w3.org/1999/xhtml"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:rich="http://richfaces.org/rich"
	xmlns:c="http://java.sun.com/jstl/core"
	xmlns:a="http://richfaces.org/a4j">

	<h:panelGrid columns="2" styleClass="personInfo"
		columnClasses="personInfoPanelGridCol1, personInfoPanelGridCol2">
		<h:outputText value="#{bookingmsgs['booking.ticketInfo.title']}" />
		<h:panelGroup>
			<h:outputText value="*" style="color:red;" />
			<h:outputText value="#{bookingmsgs['booking.ticketInfo.requiredField']}" />
		</h:panelGroup>
	</h:panelGrid>

	<h:panelGrid columns="4" id="pnlGridTicketInfo" styleClass="inputBlock"
		columnClasses="inputBlockpersonInfoCol1, inputBlockpersonInfoCol2, inputBlockpersonInfoCol3, inputBlockpersonInfoCol4">
		
		<rich:spacer />
		<rich:spacer />
		<rich:spacer />
		<h:selectOneRadio value="#{ticketBooking.selectedTripType}" required="true" id="sRdTripType">
			<f:selectItems value="#{ticketBooking.tripKinds}"/>
			<ui:remove>
			<a:support event="onchange" action="#{ticketBooking.changeTripKind()}"
				reRender="pnlGroupReturnDate1,pnlGroupReturnDate2" immediate="true" />
			</ui:remove>
		</h:selectOneRadio>
		
		<h:panelGroup>
			<h:outputText value="*" style="color:red;" />
			<h:outputText value="#{bookingmsgs['booking.ticketInfo.from']}" />
		</h:panelGroup>
		<h:selectOneMenu value="#{ticketBooking.selectedFromCity}"
			required="true" id="fromCities">
			<f:selectItems value="#{ticketBooking.departCities}" />
			<a:support action="#{ticketBooking.doChangeDepartCity()}"
				event="onchange" reRender="toCities" />
		</h:selectOneMenu>
		<rich:spacer />
		<rich:spacer />

		<h:panelGroup>
			<h:outputText value="*" style="color:red;" />
			<h:outputText value="#{bookingmsgs['booking.ticketInfo.departDate']}" />
		</h:panelGroup>
		<h:panelGroup>
			<ui:remove>
				<h:selectOneMenu id="departDay"
					value="#{ticketBooking.selectedDepartDay}" required="true">
					<f:selectItems value="#{ticketBooking.days}" />
				</h:selectOneMenu>
				<h:selectOneMenu id="departMonth"
					value="#{ticketBooking.selectedDepartMonth}" required="true">
					<f:selectItems value="#{ticketBooking.months}" />
				</h:selectOneMenu>
				<h:selectOneMenu id="departYear"
					value="#{ticketBooking.selectedDepartYear}" required="true">
					<f:selectItems value="#{ticketBooking.years}" />
				</h:selectOneMenu>
			</ui:remove>
			
			<rich:calendar value="#{ticketBooking.selectedDepartDate}"
				popup="#{true}"
				datePattern="dd.MM.yyyy HH:mm"
				cellWidth="24px"
				cellHeight="22px" style="width:200px" />
		</h:panelGroup>
		<rich:spacer />
		<rich:spacer />

		<h:panelGroup>
			<h:outputText value="*" style="color:red;" />
			<h:outputText value="#{bookingmsgs['booking.ticketInfo.to']}" />
		</h:panelGroup>
		<s:decorate template="/layout/validationTemplate.xhtml">
			<h:selectOneMenu value="#{ticketBooking.selectedToCity}" required="true" id="toCities">
				<f:selectItems value="#{ticketBooking.arriveCities}"/>
			</h:selectOneMenu>
		</s:decorate>
		<rich:spacer />
		<rich:spacer />
		
		<a:outputPanel id="pnlGroupReturnDate1" rendered="#{ticketBooking.returnDateRendered}">
			<h:outputText value="*" style="color:red;"/>
			<h:outputText value="#{bookingmsgs['booking.ticketInfo.returnDate']}" />
		</a:outputPanel>
		<h:panelGroup id="pnlGroupReturnDate2" rendered="#{ticketBooking.returnDateRendered}">
			<ui:remove>
				<h:selectOneMenu id="returnDay"
					value="#{ticketBooking.selectedReturnDay}" required="true">
					<f:selectItems value="#{ticketBooking.days}" />
				</h:selectOneMenu>
				<h:selectOneMenu id="returnMonth"
					value="#{ticketBooking.selectedReturnMonth}" required="true">
					<f:selectItems value="#{ticketBooking.months}" />
				</h:selectOneMenu>
				<h:selectOneMenu id="returnYear"
					value="#{ticketBooking.selectedReturnYear}" required="true">
					<f:selectItems value="#{ticketBooking.years}" />
				</h:selectOneMenu>
			</ui:remove>
			
			<rich:calendar value="#{ticketBooking.selectedReturnDate}"
				popup="#{true}"
				datePattern="dd.MM.yyyy HH:mm"
				cellWidth="24px"
				cellHeight="22px" style="width:200px" />
		</h:panelGroup>
		<rich:spacer />
		<rich:spacer />

	</h:panelGrid>
</ui:composition>